<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<html lang="zh-cn" style="height: 100%">
<base href="<%=basePath%>">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

    <title>卡账户充值</title>
    <link rel="stylesheet" href="css/base.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

    <script type="text/javascript" src="js/base.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
    <script type="text/javascript" src="js/handle.js"></script>
    <script type="text/javascript" src="js/sha256.js"></script>
    <script type="text/javascript" src="js/sig.js"></script>

</head>
<body class="">
<div class="wrap recharge_wrap">
    <div class="rech_topbox">
        <p>
            余额
            <span class="float_btn" onclick="changeCard()"> <i></i>
					更换
				</span>
        </p>
        <h1>
            <span class='rech_balance' id="rechBalance"></span>
            元
        </h1>
        <p>赣通卡号</p>
        <h2 id="rechCardNo"></h2>

    </div>
    <div class="rech_bodybox">
        <h3>充值金额</h3>
        <div class="rech_body_input"><i>¥</i>
            <input type="tel" maxlength="5" id="rechange_money">
            <div class="input_holder">
                <p>请输入充值金额</p>
                <p>（100元整数倍）</p>
            </div>

        </div>
    </div>
    <div class="rech_bottombox" id="rechargeBtn">
        <i></i>
        微信支付
    </div>
</div>
<div class="mask_layer none">
</div>
<div class="toast toast_timeout" style="display:none">网络异常，请稍后重试！</div>
<div class="toast toast_error" style="display:none">信息输入有误</div>
<div class="loading" style="display:none">
    <img src="img/loading.gif"></div>

<script type="text/javascript">

    // checkHasDevide(); // 检查用户是否连接过设备

    var cardNoSelect = "${cardNo}";
    var acctBalanceSelect = "${acctBalance}";
    var vehiclePlateSelect = "${vehiclePlate}";

    var token = "${token}";

    var result = eval('(' + '${result}' + ')'); // 储存卡列表接口原始数据
    // var result = eval( '(' + '{"object":[{"acctBalance":"0","cardNo":"1422220000000453","cardType":"1","certificateid":"360502198312087132","certificatetype":"0","vehicleColor":"0","vehiclePlate":"赣KL7807"}]}' + ')' ); // 储存卡列表接口原始数据
    var cardInfo = [];

    // 链接中没带有参数，则从原始数据中取第一个卡片的信息，原始数据没有卡片，则跳至卡列表页面
    if (!cardNoSelect && !acctBalanceSelect && !vehiclePlateSelect) {
        if (result.length != 0) {
            // for (var i = 0; i < result.length; i++) {
            // 	if (result[i].cardType == 1) {
            cardInfo[0] = result[0].cardNo;
            cardInfo[1] = result[0].acctBalance;
            cardInfo[2] = result[0].vehiclePlate;
            // 		break;
            // 	}
            // }
        } else {
            // 没绑卡
            window.location.href = 'card/toChangeCardPage?fromPage=recharge';
        }

    } else {
        cardInfo[0] = cardNoSelect;
        cardInfo[1] = acctBalanceSelect;
        cardInfo[2] = vehiclePlateSelect;


    }

    // 注入配置微信jssdk的参数
    wx.config({
        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
        appId: "${wxconfig.appid}", // 必填，公众号的唯一标识
        timestamp: "${wxconfig.timestamp}", // 必填，生成签名的时间戳
        nonceStr: "${wxconfig.noncestr}", // 必填，生成签名的随机串
        signature: "${wxconfig.signature}", //必填，签名，见附录1
        jsApiList: ['chooseWXPay'
        ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
    });

    // 检查用户是否连接过设备
    function checkHasDevide() {
        var hasDevice = getCookie("hasDevice"); // 从cookie取出是否连接过设备的记录
        if (!hasDevice) {
            // cookie中不存在连接过设备的记录，跳转至连接设备页
            window.location.href = "payment/checkDevice?fromPage=recharge";
        }
        ;
    }

    // 更换卡片
    function changeCard() {
        window.location.href = 'card/toChangeCardPage?fromPage=recharge&cardNo=' + cardInfo[0];
    }

    // 创建订单
    function createOrder(cardNo, money) {
        console.log('step into createOrder()')
        var orgBalance = cardInfo[1];
        var vehiclePlate = cardInfo[2];
        var data = {
            cardNo: cardNo,
            money: money,
            createFrom: 1
        }
        var time = (new Date()).valueOf();
        var sig_param = data;
        sig_param.time = time;
        sig_param.token = token;
        data.sig = reckonSig(sig_param);

        $(".loading").show();
        $.ajax({
            url: 'payment/createOrder/' + time,
            // url: 'http://demo.hgits.cn/ArsWechatServer4JX/payment/createOrder',
            type: 'POST',
            dataType: 'json',
            data: data,
            cache: false,
            timeout: 30000,
            success: function (r) {
                console.log(r);
                $(".loading").hide();

                if (r.respCode != "00") {
                    alert_LHX({
                        hasBtn: 1,
                        msg: r.msg
                    })
                    return;
                }
                //判断sig, 验证签名
                if (!r.sig) {
                    alert_LHX({
                        hasBtn: 1,
                        msg: '验证错误'
                    })
                    return;
                }

                var return_sig = r.sig;
                delete r.sig;
                var default_data = {
                    token: token
                }
                var sig = reckonSigGet(default_data, r);
                if (return_sig != sig) {
                    alert_LHX({
                        hasBtn: 1,
                        msg: '验签失败'
                    })
                    return;
                }

                var orderNo = r.orderNo;
                wx.chooseWXPay({
                    timestamp: r.timeStamp, // 支付签名时间戳
                    nonceStr: r.nonceStr, // 支付签名随机串，不长于 32 位
                    package: r.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***）
                    signType: r.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
                    paySign: r.paySign, // 支付签名
                    // appId: r.appId,
                    success: function (res) {
                        //alert("支付成功");
                        setCookie("lastRechargeMoney", money);//储存本次充值金额作为记录
                        rechargeConfirmFirst(cardNo, orderNo, money, orgBalance, vehiclePlate);
                    },
                    cancel: function () {
                        // 用户取消支付后执行的回调函数
                    },
                    fail: function () {
                        // 用户取消支付后执行的回调函数
                        //alert("支付失败");
                        alert_LHX({
                            hasBtn: 1,
                            msg: "系统异常，支付失败，请重试！"
                        })

                    },
                });

            },
            error: function (e) {
                $(".loading").hide();
                if (e.statusText == "timeout" || window.navigator.onLine == false) {
                    alert_LHX({
                        msg: "网络异常，请稍后重试！"
                    })
                    return false;
                }
                alert_LHX({
                    hasBtn: 1,
                    msg: "服务器异常，请稍后重试！"
                })
            }

        });
    }

    // 通知后台支付成功
    function rechargeConfirmFirst(cardNo, orderNo, money, orgBalance, vehiclePlate) {
        $(".loading").show();
        var data = {
            orderNo: orderNo
        };
        var time = (new Date()).valueOf();
        var sig_param = data;
        sig_param.time = time;
        sig_param.token = token;
        data.sig = reckonSig(sig_param);
        $.ajax({
            url: 'payment/confirm/' + time,
            type: 'POST',
            dataType: 'json',
            data: data,
            cache: false,
            timeout: 10000,
            complete: function (r) {
                //alert("confirm sent")
                $(".loading").hide();
                window.location.href = "payment/rechargeSuccess?cardNo=" + cardNo + "&orderNo=" + orderNo + "&money=" + money + "&orgBalance=" + orgBalance + "&vehiclePlate=" + vehiclePlate;
            }

        });
    }

    // 点击充值按钮事件
    function createOrderHandle(e) {
        var money = $("#rechange_money").val();
        if (money == "00000") {
            money = 1;
        } else {
            var regExp = /\D/ig;
            if (money % 100 != 0 || !money || regExp.test(money)) {
                alert_LHX({
                    hasBtn: 1,
                    msg: "请输入正确的充值金额（100的整数倍）"
                })
                return false;
            }
            $("#rechange_money").val(+money)
            money = money * 100;
        }
        cardNo = cardInfo[0];
        // 创建订单
        createOrder(cardNo, money);
    }

    $(function () {
        $("#rechange_money").val(""); //清除输入框面缓存

        // 卡号、余额写入界面
        $("#rechBalance").html((cardInfo[1] / 100).toFixed(2));
        $("#rechCardNo").html("3601 " + cardNumFormat(cardInfo[0]));

        try {
            var lastRechargeMoney = getCookie("lastRechargeMoney");
            if (lastRechargeMoney) {
                $("#rechange_money").val(lastRechargeMoney / 100);
                $(".input_holder").addClass('none');
            }
            ;
        } catch (e) {
        }


        $("#rechange_money").on('input', function (e) {
            var val = $(this).val();
            if (val == "") {
                $(".input_holder").removeClass('none');
            } else {
                $(".input_holder").addClass('none');
            }
        });

        wx.ready(function () {
            // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
            $("#rechargeBtn").on('click', createOrderHandle);
        });
        wx.error(function (res) {
            // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
            alert_LHX({
                hasBtn: 0,
                msg: "未获取到信息，请退出再重新进入页面！"
            })
        });

    })
</script>
</body>
</html>